<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="static/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="static/bootstrap/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="static/easyui/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/metisMenu/metisMenu_custom.css" />
<link rel="stylesheet" href="static/css/style.css" />
<script src="static/jquery/jquery-1.12.4.js"></script>
<script src="static/easyui/jquery.easyui.min.js"></script>
<script src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="static/metisMenu/metisMenu.js"></script>
<link rel="stylesheet" href="static/jquery/gantt/css/style.css" />
<link rel="stylesheet" href="static/jquery/gantt/css/prettify.css" />
<script src="static/jquery/gantt/js/jquery.fn.gantt.js"></script>
<title>施工管理平台</title>
<style type="text/css">
body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	padding: 0 0 50px 0;
}

.contain {
	width: 1000px;
	margin: 0 auto;
}

h1 {
	margin: 40px 0 20px 0;
}

h2 {
	font-size: 1.5em;
	padding-bottom: 3px;
	border-bottom: 1px solid #DDD;
	margin-top: 50px;
	margin-bottom: 25px;
}

table th:first-child {
	width: 150px;
}
/* Bootstrap 3.x re-reset */
.fn-gantt *, .fn-gantt *:after, .fn-gantt *:before {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

.modal-backdrop {
	z-index: 0;
}

.bulan {
	float: left;
	width: 230px;
	height: 60px;
	background: #1651AF;
}

.fr {
	float: right;
}

#newflg .l-btn-icon.unread {
	display: none;
}

#newflg span.num {
	position: relative;
	top: -6px;
	right: 0;
	left: -5px;
	font-size: 12px;
	line-height: 16px;
	color: #fff;
	height: 16px;
	background: red;
	border-radius: 20px;
	z-index: 10;
	padding: 0 3px;
}

.news .l-btn-text {
	color: #333;
}

.m-btn .l-btn-left .l-btn-text {
	margin-right: -5px;
}
</style>
</head>

<body class="easyui-layout main_index_container">
	<div data-options="region:'north',border:false" style="height: 60px;" class="top_container">
		<div class="bottom_content">
			<div class="bulan"></div>
			<div class="col-xs-5">
				<div class="title">施工管理系统</div>
				<div id="currentTime"></div>
			</div>
			<div class="fr text-right" style="padding-right: 20px; margin-top: 15px;">
				<div class="top_btn logout">
					<a href="#" onclick="logout()">
						<span class="glyphicon glyphicon-log-in"></span>
						&nbsp;登出
					</a>
				</div>
				<div class="top_btn user">
					<a href="#" onclick="addTab('帮助', 'help.do')">
						<span class="glyphicon glyphicon-question-sign"></span>
						<span>帮助</span>
					</a>
				</div>
				<div class="top_btn user">
					<a href="#" onclick="addTab('个人信息', 'settingsPer.do')">
						<span class="glyphicon glyphicon-user"></span>
						<span th:text="${session.userInfo.name} "></span>
					</a>
				</div>
				<div class="fr">
					<div style="">

						<a id="newflg" href="#" class="easyui-menubutton news" menu="#news" iconCls="unread">
							消息
							<span id="num" class="num">12</span>
						</a>
					</div>
					<div id="news">
						<ul>
						</ul>
						<button id="clear">全部清除</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div data-options="region:'west',split:true, border: false" style="width: 230px;" class="left_menu_container">
		<nav class="sidebar-nav">
		<ul class="metismenu" id="menu">
			<li th:each="project : ${session.userInfo.projects}" th:if="${project.status==1}">
				<a th:if="${project.type==0}" th:id="root+${project.id}" href="#" aria-expanded="false"
					th:text="${project.name}">
					<span class="glyphicon glyphicon-chevron-right arrow"></span>
				</a>
				<ul th:if="${project.type==0}" aria-expanded="false" class="collapse">
					<li th:each="child:${project.children}">
						<a href="javascript:void(0)" th:id="link+${child.id}"
							th:onclick="${'javascript:addTab('''+child.name +''','''+child.address +'.do'+''','''+child.address +''')'}"
							th:text="${child.name }"></a>
					</li>
				</ul>
				<a th:if="${project.type}==1" th:id="root+${project.id}" href="javascript:void(0)"
					th:onclick="${'javascript:addTab('''+project.name +''','''+project.address+'.do' +''','''+project.address +''')'}"
					th:text="${project.name }"></a>
			</li>
		</ul>
		</nav>
	</div>

	<div data-options="region: 'center' " class="center_container">
		<div id="tabs_container" class="easyui-tabs otherPlugin " style="width: 100%; height: 100%;">
			<div title="首页 " class="container">
				<div id="div1">
					<div style="margin-top: 5px; text-align: center">
						项目：
						<input style="min-width: 400px; text-align: center;" id="projectitem" name="projectitem"
							class="easyui-combobox" editable="false"
							data-options="
						    valueField: 'id',
						    textField: 'name',
						    url: 'projectitemlist.do?status=2',
						    onSelect: function(rec){
						    	currentprojectitem = rec;
						   		loadData();
						    },onLoadSuccess:function(data){
						    	if(data.length>0){
						    	$('#projectitem').combobox('setValue',data[0].id);
						    	currentprojectitem = data[0];
						    	loadData();
						    	}
						    },
						    panelHeight: 'auto'">
					</div>
					<div class="gantt"></div>
				</div>
			</div>
		</div>
	</div>
</body>

<script th:inline="javascript">
var ul = $("#news").find("ul")[0];
var ProjectItems = [[${ProjectItems}]];
var currentprojectitem;

$(document).ready(function() {
	notice();
	/* warningTime(); */
	getRoleid();
	if(ProjectItems==null){
		$("#div1").hide();
	}
	
	$("#menu").metisMenu();
	if ($("#root1").length == 1){
		$("#root1").click();
	}
	if ($("#root11").length == 1){
		$("#root11").click();
	}
	if ($("#link3").length == 1){
		getUnreview();
	}
	$("#tabs_container").tabs({
	  	onBeforeClose: function(title,id){
	  		var tab = $('#tabs_container').tabs('getSelected');
	  		var id = tab.panel('options').id;
	  		var name = tab.panel('options').title;
	  		if(name.indexOf("监控") != -1){
	  			var time = document.getElementById("cam-"+id.replace("tab-","")).contentWindow.gettime();
		  		var camera ={};
		  		var dailytime = 0;
		  		if(time){
		  			var cameraid = id.replace("tab-","");
	  				$.ajax({
		  				type : 'GET',
		  				url : "cameraInfo.do?id="+cameraid,
						cache : false,
						async : false,
		  				success : function(data) {
		  					camera = data;
		  					dailytime = camera.dailytime;
		  				},
		  				dataType : "json"
		  			});
		  			camera.dailytime = Number(dailytime) + Number(time);
		  			/*  $.ajax({
		  				type : 'POST',
		  				url : "CameraSave.do",
						cache : false,
						async : false,
		  				data : JSON.stringify(camera),
		  				contentType : "application/json",
		  				success : function(data) {
		  				},
		  				dataType : "json"
		  			});  */
		  		}
	  		}
		}
	});
	
	 window.onbeforeunload = function () {
  		var tab = $('#tabs_container').tabs('tabs');
  		for (i = 1; i < tab.length; i++) { 
  			var id = tab[i].panel('options').id;
	  		var name = tab[i].panel('options').title;
	  		if(name.indexOf("监控") != -1){
	  			var time = document.getElementById("cam-"+id.replace("tab-","")).contentWindow.gettime();
	  			console.log(time)
		  		var camera ={};
		  		var dailytime = 0;
		  		if(time){
		  			var cameraid = id.replace("tab-","");
	  				$.ajax({
		  				type : 'GET',
		  				url : "cameraInfo.do?id="+cameraid,
						async : false,
		  				success : function(data) {
		  					console.log("11111111111")
		  					camera = data;
		  					dailytime = camera.dailytime;
		  				},
		  				error: function (error) {
		  		            console.log(error)
		  		        }
		  			});
		  		}
	  		}
		}
    }
});

function loadData(){
	if(currentprojectitem!=null){
		$.ajax({
			type : 'GET',
			url :"getschedule.do?projectitemid="+currentprojectitem.id,
			contentType : "application/json",
			success : function(data) {
				$(".gantt").gantt({
					source:data,
					//source:[{ name: "主计划1",desc: "计划日期",values: [{id: "t01",from: "/Date(2018/09/15)/",to: "/Date(2018/09/15)/",label: "计划",customClass: "ganttRed"}]},{ame: "主计划1",desc: "计划日期",values: [{id: "t01",from: "/Date(2018/09/15)/",to: "/Date(2018/09/15)/",label: "计划",customClass: "ganttRed"}]}],
					navigate: "scroll",
					itemsPerPage: 10,
					onItemClick: function(data) {
						var obj = $.parseJSON(data);
						if(obj.projectitemid){//计划
							var html="";
							html+='<tr><td width=30%>计划内容</td>';
							html+='<td width=70%>'+obj.content+'</td></tr>';
							html+='<tr><td width=30%>百分比</td>';
							html+='<td width=70%>'+obj.percent+'%</td></tr>';
							html+='<tr><td width=30%>完成百分比</td>';
							html+='<td width=70%>'+obj.finishpercent+'%</td></tr>';
							$("#info").empty().append(html);
							$("#proDlg").modal('show');
						}
						if(obj.mainid){
							html+='<tr><td width=30%>日计划内容</td>';
							html+='<td width=70%>'+obj.content+'</td></tr>';
							html+='<tr><td width=30%>主计划百分比</td>';
							html+='<td width=70%>'+obj.percent+'%</td></tr>';
							if(obj.report){
								html+='<tr><td width=30%>工作汇报</td>';
								html+='<td width=70%>'+obj.report.content+'</td></tr>';
								html+='<tr><td width=30%>主计划完成百分比</td>';
								html+='<td width=70%>'+obj.report.percent*obj.percent/100+'%</td></tr>';
							}
							$("#info").empty().append(html);
							$("#proDlg").modal('show');
						}
					},
					onAddClick: function(dt, rowId) {
					},
					onRender: function() {
					},
					onDataLoadFailed: function(data) {
					}
				});
			}
		});
	}
}
	function notice() {
		$.ajax({
			type : 'GET',
			url : "getnotice.do",
			contentType : "application/json",
			success : function(data) {
				if (data.length > 0){
					$("#newflg .l-btn-icon").addClass("unread");
				}else{
					$("#newflg .l-btn-icon").removeClass("unread");
				}
				$("#num").html(data.length);
				var li = "";
				$.each(data, function(i,val) {
					if (val.type == 1){
						li += "<li class='read'>";
					}else{
						li += "<li>";
					}
					/* li += val.content+"<a onclick='delOrder(" + val.id + ")'>删除</a>"; */
					li += val.content+"<a href='' onclick='delOrder(" + val.id + ")'><span style='float:right' class='glyphicon glyphicon-remove'></span></a>";
					li += "</li>";
				})
				$(ul).empty().append(li);
			},
			dataType : "json"
		});
	}
	function delOrder(id) {
		$.ajax({
			type : 'POST',
			url : "noticeDelete.do?id=" + id,
			contentType : "application/json",
			success : function(data) {
				if (data.success){
					notice();
				}else{
					$.messager.alert('操作', '删除失败', 'error');
				}
			},
			dataType : "json"
		});
	}
	/* function warningTime() {
		$.ajax({
			type : 'GET',
			url : "warningTime.do",
			contentType : "application/json",
			dataType : "json"
		});
		$.ajax({
			type : 'GET',
			url : "warningMoney.do",
			contentType : "application/json",
			dataType : "json"
		});
	} */
	function getUnreview() {
		$.ajax({
			type : 'GET',
			url : "reviewlist.do",
			contentType : "application/json",
			success : function(data) {
				if (data.rows.length > 0){
					if ($("#tip").length == 0){
						$("#link3").append('<font color="red" id="tip">&nbsp;new!</font>')
					}
				}else{
					if ($("#tip").length > 0){
						$("#tip").remove();
					}
				}
			},
			dataType : "json"
		});
	}
	function addTab(title,url,id) {
		if (id == 'unreviewed'){
			$("#tip").remove();
		}
		var content = '<iframe scrolling="auto" id="cam-' + id + '" frameborder="0"  src="' + url
				+ '" style="width:100%;height:100%;"></iframe>';
		if ($('#tabs_container').tabs('exists', title)){
			$('#tabs_container').tabs('select', title);
			var selTab = $('#tabs_container').tabs('getSelected');
			$('#tabs_container').tabs('update', {
				tab : selTab,
				options : {
					title : title,
					content : content
				}
			})
		}else{
			$('#tabs_container').tabs('add', {
				id:"tab-"+id,
				title : title,
				content : content,
				closable : true
			});
		}
	}
	$("#clear").click(function() {
		$.ajax({
			type : 'GET',
			url : "clearnotice.do",
			contentType : "application/json",
			complete : function(data) {
				$(ul).empty();
				$("#newflg .l-btn-icon").removeClass("unread");
				$("#num").html(0);
			},
			dataType : "json"
		});
	})
	function logout() {
		$.messager.confirm("系统提示", "您确定要退出系统吗?", function(r) {
			if (r){
				window.location.href = "logout.do";
			}
		});
	}
	function formatDate(time) {
		var date = new Date(time);
		var year = date.getFullYear(),month = date.getMonth() + 1,//月份是从0开始的
		day = date.getDate(),hour = date.getHours(),min = date.getMinutes(),sec = date.getSeconds();
		var newTime = year + '-' + month + '-' + day + ' ' + hour + ':' + min + sec;
		return newTime;
	}
	//获取邮箱未读数量 
	function newMail(){
		$.ajax({
            type: 'GET',
            url: 'newMsg',      //请求参数
            dataType: "json",
            success: function(data){
            	var liMymail = $("#root30");
            	if($("#root30").find("span").length){
            		$("#Num").remove();
            	}
                if(data){
                    var mailNum = "<span class='badge pull-right' id='Num'>"+data+"</span>";
                    liMymail.append(mailNum);
                }
            }
        });
	}
	
	//判断登录用户的角色
	function getRoleid(){
		$.ajax({
			type:"GET",
			url:"getRoleid",
			dataType:"json",
			success:function(data){
				if(data==1){
					newMail();
					/* window.setInterval("newMail()", 10000); */
				}
			}
		});
	}
</script>
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

.news.l-btn {
	color: white;
}

.news .l-btn-text {
	font-size: 15px;
}

.news.l-btn-plain:hover {
	background: transparent;
	border: 1px solid transparent;
}

span.num {
	position: absolute;
	top: -8px;
	right: 10px;
	font-size: 12px;
	color: indianred;
}

#news {
	width: 450px;
	padding: 5px 0;
}

#news .menu-line {
	display: none;
}

#news ul, #news li {
	list-style: none;
}

#news ul {
	height: 300px;
	overflow-y: auto;
}

#news li a:hover {
	background: #F5F5F5;
}

#news button {
	background: #359DF7;
	color: #FFF;
	padding: 5px 20px;
	border: 0;
	display: block;
	margin: 6px auto;
}

.l-btn-plain:hover, .m-btn-plain-active {
	background: transparent;
	color: white;
	border: 1px solid transparent;
}

#news li {
	display: block;
	box-sizing: border-box;
	padding: 8px 40px 8px 60px;
	vertical-align: middle;
	position: relative;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	background: #9EEA6A;
}

#news li.read {
	background: #FFFFE0;
}

#news li:before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 20px;
	margin-top: -16px;
	width: 32px;
	height: 32px;
	background-image: url(static/imges/approve.png);
	/*background-size: 32px auto;*/
	background-position: center;
	background-repeat: no-repeat;
	margin-right: 5px;
	vertical-align: middle;
}

#news li.read:before {
	background-image: url(static/imges/unapprove.png);
}

.unread {
	background-image: url(static/imges/!.png);
	width: 16px auto;
	background-position: center;
	background-repeat: no-repeat;
}
</style>

</html>